<template>
<div class="zon-container wap">
  <x-header v-if="!this.$fromApp(this)" class="vux-1px-b" :left-options="{backText: ''}"><span>{{title}}</span></x-header>
  <div class="main">
    <scroller
      ref="scroll"
      :noDataText="this.$noData(customerList)"
      :on-refresh="refresh"
      :on-infinite="infinite">
      <div class="list">
        <customerItem @dialogComfrim="dialogComfrim" :checkListArray="checkListArray"  :list="customerList"></customerItem>
      </div>
      <no-data v-show="loadOk" @refreshData="refresh(0)" :list="customerList"></no-data>
    </scroller>
  </div>
</div>
</template>
<script type="text/ecmascript-6">
  import  customerItem from  '../../components/customer-manager-item.vue'
    export default{
      components:{
        customerItem
      },
       data(){
         return {
           page:1,
           title:'',
           categoryId:'',
           customerList:[],
           hasNext:true,
           checkListArray:[],
           loadOk:false
         }
       },
      created(){
         this.title=decodeURIComponent(this.$route.query.title).toString().replace(/%/g,'~~pct~~');
         this.categoryId=this.$route.query.id;
         this.initCheckList();
         this. initData(0);
      },
      mounted(){
        window['androidCallJs'] = this.androidCallJs;
      },
      methods:{
        androidCallJs(val) {
          val= decodeURIComponent(val.replace(/\+/g, '%20'));
          let obj = this.$getJson(val);
          if(obj.code==1017){
            this.initData(0);
          }
        },
        initCheckList(){
          this.$ajax.get("customer/category/list",(res) => {
            if(res.code==200){
              for(var i=0;i<res.data.length;i++){
                this.checkListArray.push({key:res.data[i].id,value:res.data[i].name});
              }
            }else{
              this.$vux.toast.text(res.msg, 'center');
            }
          },{})
        },
        initData(type){
          this.$ajax.get("customer/category/group/list",(res) => {
            console.log("-====",res)
            if(res.code==200){
              if(type==0){
                this.customerList=res.data;
              }else{
                this.customerList=this.customerList.concat(res.data);
              }

              type==0&&this.$refs.scroll&&this.$refs.scroll.finishPullToRefresh();
              if(res.data&&res.data.length<this.$rows||res.data==undefined){
                this.hasNext=false;
                type==1&&this.$refs.scroll&&this.$refs.scroll.finishInfinite(true);
              }else{
                this.hasNext=true;
                type==1&&this.$refs.scroll&&this.$refs.scroll.finishInfinite(false);
              }
            }else{
              this.hasNext=false;
              this.$vux.toast.text(res.msg, 'center');
              type==0&&this.$refs.scroll&&this.$refs.scroll.finishPullToRefresh();
              type==1&&this.$refs.scroll&&this.$refs.scroll.finishInfinite(false);
            }
            this.loadOk=true
          },{pageNo :this.page,pageSize:this.$rows,customerCategoryId:this.categoryId});
        },
        refresh(){
          this.hasNext=true;
          this.page=1;
          this.initData(0);
        },
        infinite(){
          if(this.hasNext){
            this.page++;
            this.initData(1);
          }else{
            this.$refs.scroll&&this.$refs.scroll.finishInfinite(true)
          }
        },
        dialogComfrim(){
          this.hasNext=true;
          this.page=1;
          this.initData(0);
        }
      }
    }
</script>

<style  lang="less" type="text/less" scoped>
.zon-container{
    background: #fff;
  .list{
    padding: .2rem .3rem;
  }
}
</style>
